Dual Axes Chart

Plots two different variables on separate axes, allowing for comparison and analysis of their trends. This is useful for visualizing the relationship between two variables that have different scales or units, or for comparing trends over time with different metrics.

Chart:

Code:

  muze
    .canvas()
    .columns(["Year"])
    .rows([["Miles_per_Gallon"], ["Horsepower"]])
    .layers([
      {
        mark: "bar",
        encoding: {
          y: "Miles_per_Gallon",
          color: "Origin",
        },
      },
      {
        mark: "line",
        encoding: {
          y: "Horsepower",
          color: {
            value: () => colorRange[4],
          },
        },
      },
    ])